<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>for循环</title>
  <style>
    span {
      display: inline-block;
      width: 60px;
      height: 30px;
      line-height: 30px;
      text-align: center;
      background-color: lightyellow;
      border: 1px solid red;
      margin-right: 2px;
      margin-bottom: 2px;
    }
  </style>
  <script>
    /**
     * 案例一：打印1-100之间个位数是3的数字，每五个一换行!
     * 分析：
     *   ① 个位数是3，i % 10 == 3
     *   ② 每五个一换行，count % 5 == 0 此时打印换行document.write("<br>")
     */
    function fun1(){
      // 1.1 定义计数器
      let count = 0
      // 1.2 开始打印满足条件的数字
      document.write("1-100之间能被3整除的数字如下：<hr>")
      for (let i = 1; i <= 100; i++) {
        if (i % 10 === 3) {
          // 1.2.1 输出变量值
          document.write( "<span>" + i + "</span>")
          // 1.2.2 累加计数器
          count++
          // 1.2.3 打印换行
          if (count % 5 === 0) {
            document.write("<br>")
          }
        }
      }
    }
    fun1()
  </script>
</head>
<body>

</body>
</html>
